<template>
  <view class="modern-material-container">
    <!-- 顶部导航栏 -->
    <back :showBackText="false" customClass="modern-header" title="学习资料"></back>

    <!-- 主内容区域 -->
    <view class="content-wrapper" v-if="isLoad">
      <scroll-view scroll-y class="modern-scroll">
        <!-- 空状态 -->
        <view v-if="dataList.length == 0" class="empty-state">
          <view class="empty-icon">📚</view>
          <text class="empty-text">暂时还没有资料</text>
        </view>
        <!-- 资料列表 -->
        <view v-else class="material-list">
          <view class="material-item" v-for="(item, index) in dataList" :key="index" :data-id="item.id" @tap="itemTap">
            <view class="item-header">
              <view class="item-icon">
                <text class="icon-text">📄</text>
              </view>
              <view class="item-title-section">
                <text class="item-title">{{ item.name }}</text>
                <view class="item-badge">
                  {{ item.version == 1 ? '在线文档' : '网盘资料' }}
                </view>
              </view>
            </view>
            <view class="item-footer">
              <view class="stats-info">
                <view class="stat-item">
                  <text class="stat-icon">🔥</text>
                  <text class="stat-text">{{ item.hot }} 人学习</text>
                </view>
              </view>
              <view class="action-area">
                <view class="action-button">
                  <text class="action-text">查看详情</text>
                  <text class="action-arrow">→</text>
                </view>
              </view>
            </view>
          </view>
        </view>
      </scroll-view>
    </view>

    <!-- 悬浮操作按钮 -->
    <view class="fab-container" v-if="isLoad && !appIsAudit" @tap="shareTap">
      <view class="fab-button">
        <text class="fab-icon">+</text>
      </view>
      <text class="fab-label">分享资料</text>
    </view>
  </view>
</template>

<script>
	let that = null;
	let app = getApp();
	export default {
		data() {
			return {
				id: 0,
				isLoad: false,
				appIsAudit: app.globalData.appIsAudit,
				dataList: []
			};
		},
		onLoad(options) {
			that = this;
			that.id = options.id;
			that.getList();
		},
		methods: {
			itemTap(options) {
				console.log(options)
				let id = options.currentTarget.dataset.id;
				let url = `/pages/practice/material/detail?id=${id}`;
				uni.navigateTo({
					url: url
				});
			},
			shareTap(options) {
				let url = `/pages/practice/material/share?id=${that.id}`;
				uni.navigateTo({
					url: url
				});
			},
			getList() {
				if(that.appIsAudit){
					that.isLoad = true;
					return;
				}
				app.globalData.service.getMaterialList(that.id).then(res => {
						that.isLoad = true;
						that.dataList = res.data;
					})
					.catch(function(a) {
						app.showToast('获取资料失败');
					});
			},
		}
	};
</script>

<style src="./list.css"></style>
